<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>indexedDB简单实例</title>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
    

    <script src="../date/indexedDB.js"></script>
    <script>

        //数据库名
        let databaseName = 'database1';
        //表名
        let tableName = 'table1';

        database.open(databaseName, tableName).then((db, msg) => {  // 打开 / 创建 Indexed 数据

            console.log(db, msg);

             // 新增数据
            database.add(db, tableName, { id: 1, name: '张三', age: 24 }).then((msg)=>{
                console.log(msg);
            }); 
            database.add(db, tableName, { id: 2, name: '李四', age: 30 }).then((msg)=>{
                console.log(msg);
            }); 

            // 通过主键读取数据
            let keyData = database.key(db, tableName, 1).then((data)=>{
                console.log("通过主键读取数据："+JSON.stringify(data));
            }); 

            // 通过游标读取数据
            database.cursor(db, tableName).then((data)=>{
                console.log("通过游标读取数据："+JSON.stringify(data));
            }); 

            // 通过索引读取数据
            database.index(db, tableName,'name', '张三').then((data)=>{
                console.log("通过索引读取数据："+JSON.stringify(data));
            }); 

            // 通过索引和游标查询记录
            database.cursorAndIndex(db, tableName, 'name', '张三').then((data)=>{
                console.log("通过索引和游标查询记录："+JSON.stringify(data));
            }); 

            // 更新数据
            database.update(db, tableName, { id: 1, name: '张三', age: 25 }).then((msg)=>{
                console.log(msg);
            }); 

            // 删除数据
            database.delete(db, tableName, 2).then((msg)=>{
                console.log(msg);
            }); 

            // 通过索引和游标删除指定的数据
            database.cursorAndIndexDelete(db, tableName, 'name', '张三').then((msg)=>{
                console.log(msg);
            }); 

            // 关闭数据库
            database.close(db) 
        })

    </script>
</body>
</html>